<template>
	<view>
		<view class="head">
			<image src="../../static/images/arrow_left.png" mode="" @click="Gonew"></image>
			<view class="">添加分类包含的客户</view>
			<view class="f42" @click="add">+</view>
		</view>
		<uni-swipe-action v-for="item in arr" @click="go(item)" :key="item.rank_id">
			<uni-swipe-action-item :options="options" @click="onClick(item.rank_id)" @change="change" :data="item.rank_id">
				<view class="add" @click="go(item)">
					<view class="box" >
						<view class="box-t">{{ item.rank_name }}</view>
						<view class="box-b">{{ item.rank_discount == 100 ? '无折扣' : item.rank_discount + '折' }}</view>
					</view>
				</view>
			</uni-swipe-action-item>
		</uni-swipe-action>
	</view>
</template>

<script>
import uniSwipeAction from '@/components/uni-swipe-action/uni-swipe-action.vue';
import uniSwipeActionItem from '@/components/uni-swipe-action-item/uni-swipe-action-item.vue';
export default {
	data() {
		return {
			options: [
				{
					text: '刪除',
					style: {
						backgroundColor: '#dd524d'
					}
				}
			],
			showBox: true,
			zhe: '00',
			arr: {}
		};
	},
	components: {
		uniSwipeAction,
		uniSwipeActionItem
	},
	onLoad() {
		this.showBoxs();
	},
	methods: {
		add() {
			uni.navigateTo({
				url: 'newCustomer?id=' + this.zhe
			});
		},
		showBoxs() {
			let that = this;
			that.$ajax('api/v1.customer/rankList', {}, 'GET').then(res => {
				console.log(res);
				this.arr = res.result;
			});
		},
		go(e) {
			uni.navigateTo({
				url: '../clientservice/site?user=' + JSON.stringify(e)
			});
		},
		onClick(e) {
			// console.log(e);
			this.$ajax('api/v1.customer/delRank', {
				rank_id: e
			})
				.then(res => {
					uni.navigateTo({
						url: 'AddtheClassification'
					});
				})
				.catch(res => {
					console.log(Error);
				});
		},
		change(open) {
			// console.log('当前开启状态：' + open);
		},
		Gonew() {
			uni.navigateTo({
				url: '../clientservice/site'
			});
		},
	
	}
};
</script>

<style lang="scss">
page {
	background-color: #f7f4f8;
}
.head {
	height: 88rpx;
	line-height: 88rpx;
	background-color: #249af6;
	color: #ffffff;
	display: flex;
	justify-content: space-between;
	padding: 0 30rpx;
	font-size: 36rpx;
	font-family: PingFang SC;
	font-weight: 500;
	image {
		width: 22rpx;
		height: 39rpx;
		margin-top: 25rpx;
	}
}
.f42 {
	font-size: 80rpx;
}
.box {
	padding: 30rpx;
	font-size: 32rpx;
	font-family: PingFang SC;
	font-weight: 500;
	color: rgba(51, 51, 51, 1);
	line-height: 40rpx;
	margin-top: 29rpx;
	background-color: #ffffff;
	border-bottom: 2rpx solid #cccccc;
	width: 100%;
}
.add {
	width: 100%;
	box-sizing: border-box;
}
</style>
